import { defineStore } from 'pinia'
import { RouteLocationNormalizedLoaded } from 'vue-router'

export interface ITab extends RouteLocationNormalizedLoaded {
  title: string | null;
}

interface ITabsState {
  tabList: ITab[];
}

export const useTabsStore = defineStore('tabs', {
  state (): ITabsState {
    return {
      tabList: []
    }
  },
  getters: {
    cacheMenu (state: ITabsState): string[] {
      return state.tabList.reduce((base, item) => {
        !item.meta.noCache && base.push(item.name as string)
        return base
      }, [] as string[])
    }
  },
  actions: {
    addTab (tab: ITab) {
      if (this.tabList.some((t) => t.fullPath === tab.fullPath)) {
        return
      }
      this.tabList.push(tab)
    },
    removeTab (tab: ITab) {
      this.tabList = this.tabList.filter(item => item.title !== tab.title)
    }
  }
})
